Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

(fix) O3-3890 Help menu (and menu items) should use a standard Carbon… #1164

Open
wants to merge 5 commits into
base: main
Choose a base branch
from

Conversation

Samstar10
Copy link
Contributor

@Samstar10 Samstar10 commented Sep 26, 2024

Requirements

  • This PR has a title that briefly describes the work done including the ticket number. Ensure your PR title includes a conventional commit label (such as feat, fix, or chore, among others). See existing PR titles for inspiration.

For changes to apps

If applicable

  • My work includes tests or is validated by existing tests.
  • I have updated the esm-framework mock to reflect any API changes I have made.

Summary

I have updated the help menu to use standard carbon menu items. This PR is related to this PR openmrs/openmrs-esm-user-onboarding#21

Screenshots

Screenshot 2024-09-26 at 16 42 54

Related Issue

https://openmrs.atlassian.net/browse/O3-3890

Other

{t('docs', 'Docs')}
</Link>
label={t('documentation', 'Documentation')}
onClick={() => window.open('https://o3-docs.openmrs.org', '_blank')}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we move the onClick handler to a function that's wrapped in a useCallback hook?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Noted

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wouldn’t expect these changes to be included here. Bad rebase?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, a mistake on my end, I'll fix it

{t('communityforum', 'Community forum')}
</Link>
label={t('communityforum', 'Community forum')}
onClick={() => window.open('https://talk.openmrs.org', '_blank')}
Copy link
Member

@denniskigen denniskigen Oct 5, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we wrap the onClick handlers in use callback hooks? Additionally, for security, it’s good to add noreferrer noopener to external links:

const handleClick = useCallback(() => {
  window.open('https://talk.openmrs.org', '_blank', 'noopener,noreferrer');
}, [url]);

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Noted

@denniskigen
Copy link
Member

One challenge with this approach is that we can't leverage the renderIcon prop of the MenuItem component. To leverage it, the MenuItem must have a Menu component as its direct parent, and Menu's mode prop should be set to basic.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants